<template>
  <div class="head">
    <div @click="returnHtml(returnUrl)">
      <svg class="icon" aria-hidden="true">
        <use xlink:href="#iconfanhuijiantou"></use>
      </svg>
    </div>
    <div>
      {{headName}}
    </div>

  </div>
</template>

<script>
  export default {
    name: "easyHead",
    props: {
      // 是否请求服务器端数据
      headName: {
        default: "简易生活"
      },
      returnUrl: "",
    },
    methods:{
      returnHtml(returnUrl){
        this.$router.push({path: returnUrl})
      }
    },
    mounted(){
      console.log(this.returnUrl)
    },

  }
</script>

<style scoped lang="stylus">


  .head > :last-child {
    width: 80%;
    text-align: center;
  }

  .head > :first-child {
    width: 10%;
    text-align: center;

  }

  .head > div {
    float: left;
  }

  .head {
    height: 1rem;
    width: 100%;
    background-color: #ff8162;
    font-size: 0.5rem;
    line-height: 1rem;
    font-weight: 600;
  }
</style>
